<template>
	<div id="box">
		<div
			class="temp_plate print-wrap-80 print-wrap-normal"
			style="width: 80mm;font-size: 12px;
		    padding: 10px;
		    border: 1px solid #a5a5a5;
		    box-shadow: 2px 2px 2px #d3d3d3;text-align: left;"
		>
			<h2>{{sellerInfo.name}}预结账({{orderInfo.eatType}})</h2>

			<p class="panelone panelone1_2 panelone2">
				<span v-show="false" id="HIsNull">{{orderInfo.diningTableNo}}</span>
				<span>桌号:{{orderInfo.diningTableNo}}</span><br>
				<span>单号:{{orderInfo.orderId}}</span><br>
				<span>人数:{{orderInfo.eatNumer}}人</span><br>
				<span>开台时间:{{orderInfo.openTime}}</span><br>
			</p>
			<div>------------------------------------------------------</div>
			<el-table :data="orderInfo.foodVos" style="width: 100%;">
				<el-table-column prop="foodName" label="品名">
					<template slot-scope="scope">
						<div>
							<span v-show="scope.row.giveFoodStatus === 1" style="color: red;">赠</span>
							{{ scope.row.foodName }}
						</div>
						<div style="color: forestgreen;font-size: 0.5rem;">{{ scope.row.requirementName }}</div>
					</template>
				</el-table-column>
				<el-table-column prop="name" label="数量">
					<template slot-scope="scope">
						<i class="el-icon-remove-outline cursor"></i>
						&nbsp;&nbsp;{{ scope.row.foodNum }}&nbsp;&nbsp;
						<i class="el-icon-circle-plus-outline cursor"></i>
					</template>
				</el-table-column>
				<el-table-column prop="price" label="金额">
					<template slot-scope="scope">
						<div style="color: red;">￥{{ Number(scope.row.total) }}元</div>
					</template>
				</el-table-column>
			</el-table>
			<br>
			<div>------------------------------------------------------</div>
			<div align="center">
				合计:<span style="color: red;size: 1.25rem;">￥{{orderInfo.totalMoney }}元</span><br>
				应收:<span style="color: red;size: 1.25rem;">￥{{orderInfo.totalMoney }}元</span>
			</div>
			<div>------------------------------------------------------</div>

			<div style="margin-top: 10px;" class="mf15mmwithbigsize"></div>

			<p class="panelone">
				<span>联系电话:{{sellerInfo.linkTel}}</span>
			</p>

			<p class="panelone">
				<span>地址:{{sellerInfo.address}}</span>
			</p>
			<div style="margin: 8px 0px;">操作员:{{sellerInfo.linkName}}</div>
			<div>------------------------------------------------------</div>
				<h1>谢谢光临</h1>
			<div>------------------------------------------------------</div>

		</div>

	</div>
</template>

<script>
import { getLodop } from '../../../../../utils/lodop.js';
export default {
	data() {
		return {
			sellerInfo:{},
			orderInfo:{},
			ticketHtml:''
		};
	},

	created() {
		this.initData();
	},


	methods: {
		initData(){
			this.sellerInfo = JSON.parse(this.$cookie.get("sellerInfo"))
		},

	    printPdf(orderInfo){
			this.orderInfo = orderInfo
			if(document.getElementById("HIsNull").innerText !== this.orderInfo.diningTableNo){
				this.$emit("DataIsNull")
			}else{
				let LODOP = getLodop();
				if (LODOP != null && typeof LODOP.VERSION != 'undefined') {
					LODOP.PRINT_INIT('');
					LODOP.SET_PRINT_PAGESIZE(3, '58mm', '10mm', 'CreateCustomPage');
					LODOP.SET_PRINT_STYLE('FontSize', 15); // 设置打印字体
					LODOP.SET_PRINT_STYLE('Bold', 1); // 设置加粗
					LODOP.SET_PRINT_MODE('PRINT_PAGE_PERCENT', 'Height:90%');
					LODOP.SET_PRINT_MODE('PRINT_PAGE_PERCENT', 'Full-Width');
					var strHTML = document.getElementById('box').innerHTML;
					LODOP.ADD_PRINT_HTM(10, 10, '100%', '70%', strHTML);
					LODOP.PRINT();
					//LODOP.PREVIEW();
				}
			}
		},

	},
};

</script>

<style></style>
